<template>
	<div>
	</div>
</template>

<script>
	export default{
		name:'gift'
	}
</script>

<style>
.hjPopGift{position:absolute}
.hjPopGift.hjPopGift_small{opacity:0;font-size:12px;padding:0 50px 0 20px;background-color:rgba(0,0,0,.3);-webkit-border-radius:20px;-moz-border-radius:20px;border-radius:20px;transform: translateX(-100%); -webkit-transition-duration:.3s;-moz-transition-duration:.3s;-ms-transition-duration:.3s;-o-transition-duration:.3s;transition-duration:.3s;-webkit-transition-property:opacity,left,top,transform;-moz-transition-property:opacity,left,top,transform;-ms-transition-property:opacity,left,top,transform;-o-transition-property:opacity,left,top,transform;transition-property:opacity,left,top,transform;z-index:998}
.hjPopGift.hjPopGift_small.first{top:8.75rem;height:35px;font-size:14px;color:#fff;line-height:35px}
.hjPopGift.hjPopGift_small.last{top:160px}
.hjPopGift.hjPopGift_small .icon-avatar{display:block;position:absolute;left:0;top:0;width:35px;height:35px;background-repeat:no-repeat;background-position:0 0;-webkit-background-size:100% auto;background-size:100% auto;-webkit-border-radius:20px;-moz-border-radius:20px;border-radius:20px;border:1px solid #fff;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}
.hjPopGift.hjPopGift_small .nickname{height:20px;line-height:20px;color:#fff}
.hjPopGift.hjPopGift_small .to_nick_name{margin: 0 3px;color:red}
.hjPopGift.hjPopGift_small .teacher_name{color:#299efb;display:inline-block;max-width:90px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;vertical-align:bottom}
.hjPopGift.hjPopGift_small .icon-gift{display:block;position:absolute;right:0;bottom:0;width:50px;height:50px;background-repeat:no-repeat;background-position:0 0;-webkit-background-size:100% auto;background-size:100% auto;-webkit-border-radius:20px;-moz-border-radius:20px;border-radius:20px}
.hjPopGift.hjPopGift_small .giftNum{position:absolute;left:100%;top:-10px;font-size:20px;color:#eb2828}
.hjPopGift.hjPopGift_small.first.active,.hjPopGift.hjPopGift_small.last.active{transform:translateX(10px);opacity:1}
.hjPopGift.hjPopGift_small .giftNum.active{-webkit-animation:giftNum .1s ease-in-out 0s;-o-animation:giftNum .1s ease-in-out 0s;animation:giftNum .1s ease-in-out 0s}
@-webkit-keyframes giftNum{0%{-webkit-transform:scale(3);-moz-transform:scale(3);-ms-transform:scale(3);-o-transform:scale(3);transform:scale(3)}
50%{-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);transform:scale(1)}
100%{-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);transform:scale(1)}
}
@-o-keyframes giftNum{0%{-webkit-transform:scale(3);-moz-transform:scale(3);-ms-transform:scale(3);-o-transform:scale(3);transform:scale(3)}
50%{-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);transform:scale(1)}
100%{-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);transform:scale(1)}
}
@-moz-keyframes giftNum{0%{-webkit-transform:scale(3);-moz-transform:scale(3);-ms-transform:scale(3);-o-transform:scale(3);transform:scale(3)}
50%{-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);transform:scale(1)}
100%{-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);transform:scale(1)}
}
@keyframes giftNum{0%{-webkit-transform:scale(3);-moz-transform:scale(3);-ms-transform:scale(3);-o-transform:scale(3);transform:scale(3)}
50%{-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);transform:scale(1)}
100%{-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);transform:scale(1)}
}
.from_nick_name,.to_nick_name{display: inline-block;max-width: 5.62rem;vertical-align: top;}
</style>
